<template>
<view class="card-page-title">
	<view :class="'iconfont '+icon"></view>
	<view class="title-content">
		<view class="title">{{title}}</view>
		<view class="sub-title">{{subTitle}}</view>
	</view>
</view>
</template>

<script>
export default {
	data() {
		return {
		}
	},
	props: {
		title: {
			type: String, default: '配置'
		},
		icon: {
			type: String, default: ''
		},
		subTitle: {
			type: String, default: ''
		}
	},
	methods: {
	}
}
</script>

<style lang="scss">
.card-page-title {
	display: inline-flex; width: calc(100% - 120rpx); padding: 20rpx 60rpx;
	.iconfont {
		font-size: 120rpx; color:#FFF; margin-left: 100rpx; margin-right: 20rpx;
	}
	.title-content {
		flex: 1; color:#FFF;
		
		.title {
			font-weight: bold; font-size: 36rpx; padding-bottom: 10rpx; 
		}
		.sub-title {
			color:#ffe2cc; font-size: 26rpx; line-height: 1.7;
		}
	}
}
</style>
